// 临时备忘录倒计时组件  单机数据存在浏览器本地存储

const lsbwldjs = defineComponent({
    props: [],
    emits: [],
    setup() {
        //[{name:'',datetime:'yyyy-MM-dd HH:mm:ss', type: 'warning'}]
        let bwlFromLocalStorageArray = BrowserLocalStorageUtil.getItemObjOrArray("waitCompleteBwlList");
        bwlFromLocalStorageArray = bwlFromLocalStorageArray == null ? [] : bwlFromLocalStorageArray;

        const bwlList = ref(bwlFromLocalStorageArray)
        const input = ref('')

        function addBwl() {
            if (input.value == '') {
                ElMessage("需要先填写内容!")
                return;
            }
            ArrayUtil.addOne(bwlList.value, {
                name: input.value,
                datetime: DateUtil.date2DateTimeStr(new Date()),
                type: 'warning'
            })
            input.value = ''
            BrowserLocalStorageUtil.setItem("waitCompleteBwlList", bwlList.value)
        }

        function completeBwl(bwl) {
            bwl.type = bwl.type == "success" ? "warning" : "success"
            BrowserLocalStorageUtil.setItem("waitCompleteBwlList", bwlList.value)
        }

        function deleteBwl(bwl) {
            ElMessageBox.confirm(
                '请确认是否删除，慎重操作?',
                '删除',
                {
                    confirmButtonText: '确认删除',
                    cancelButtonText: '取消删除',
                    type: 'warning',
                }
            ).then(() => {
                ElMessage({type: "success", message: "确认删除"})
                ArrayUtil.deleteOne(bwlList.value, bwl)
                BrowserLocalStorageUtil.setItem("waitCompleteBwlList", bwlList.value)
            })
            .catch(() => {
                ElMessage("取消删除")
            })
        }

        function clearAllBwl() {
            if(bwlList.value.length == 0){
                ElMessage("暂无数据可删除")
                return;
            }
            ElMessageBox.confirm(
                '请确认是否删除所有数据，慎重操作?',
                '删除',
                {
                    confirmButtonText: '确认删除',
                    cancelButtonText: '取消删除',
                    type: 'warning',
                }
            ).then(() => {
                ElMessage({type: "success", message: "确认删除"})
                ArrayUtil.clearAll(bwlList.value)
                BrowserLocalStorageUtil.setItem("waitCompleteBwlList", bwlList.value)
            })
            .catch(() => {
                ElMessage("取消删除")
            })
        }

        return {bwlList, input, addBwl, deleteBwl, completeBwl, clearAllBwl};
    },
    template: `
    <div>
        <el-input v-model="input" style="width: 500px" placeholder="记点什么呢?" clearable @keyup.enter="addBwl" />
        <el-button type="white" circle style="margin-left: 5px" @click="addBwl"><el-icon><Plus /></el-icon></el-button>
        <el-button type="danger" circle @click="clearAllBwl"><el-icon><Delete/></el-icon></el-button>
        <li v-for="bwl in bwlList" style="margin-top: 10px; display: flex; align-items: flex-start;">
            <el-button type="danger" plain style="width: 40px;" @click="deleteBwl(bwl)">删除</el-button>
            <el-button :type="bwl.type" circle @click="completeBwl(bwl)"><el-icon><Check/></el-icon></el-button>
            <el-tag type="primary" style="margin-left: 5px; height: 40px;">{{ bwl.datetime }}</el-tag>
            <el-input v-model="bwl.name"
                style="margin-left: 5px; width: 500px; font-weight: bold; font-size: 20px;"
                autosize disabled
                type="textarea"
                placeholder=""
            />
        </li>
    </div>
    `
});